body{
    background: url('/fuelphp/assets/img/home/background.jpg') repeat;
}
.eminema{
    text-decoration:none;
}
a{
	text-decoration: none;	
}
div{
    border-radius: 6px;
}

ol, ul{
    list-style: none;
}

#wrapper{
	padding: 0px;
    width: 800px;
    margin: 5px auto;
	border: 2px solid #dedede;
	background: white;
}

#header{
    display:inline-block;
	padding: 3px 0px;
	border-bottom: 3px solid #4e8c8a;
	border-top: 3px solid #4e8c8a;
	border-radius: 0px;
}

#header img{
    float:left;
}

#navigation{
	float:	left;
    width:	598px;
	height: 30px;
	margin: 0px 5px;
}

#topNavigation{
	background: red;
}

#search{
	margin: 2px 0 0 0;
    float:left;
}
#search #txtSearch{
	float:left;
    width:400px;
	height: 31px;
	border: 1px solid #4e8c8a;
}
#search #btnSearch{
	float:left;
    width: 32px;
    height: 32px;
	background-color:  transparent;
    background-image: url('/fuelphp/assets/img/home/btnsearch.png');
    background-repeat: no-repeat;
	border: 0;
	margin-left: 5px;
	margin-top: 2px;
}

#login img{
}

#login{ 
	margin: 5px 0 0 0;
	float:right;
}

#login a{
    outline: 0 none;
    color: #17658c;
    line-height: 1.5em;
	font-size:11px;
    font-family: Tahoma,Arial,sans-serif;
}

#login a:hover{
    text-decoration: underline;
}

/* Style cho menu */

#btmNavigation{
	width: 600px;
	float: left;
	padding: 0px 0px;
	margin: 13px 0px;
	border: 0px 0px 0px 0px;
}

#btmNavigation ul{
	padding: 0px 0px;
	margin: 0px 0px;
	border: 0px 0px 0px 0px;
}

#btmNavigation ul li{
    float: left;
    position:relative;
}



#btmNavigation ul li a:hover{
    text-decoration: underline;
    color: #E8D3B2;
}

    
#btmNavigation ul li .topMenu{
    padding: 6px 35px;
    line-height:1.5em;
    min-width:55px;
    text-align:center;
    color: #385c51;
    font-size:15px;
    font-weight:bold;
    text-transform:uppercase;
    letter-spacing:1px;
    cursor:pointer;

    text-shadow:1px 1px 1px rgba(255,255,255,0.3);
    -moz-text-shadow:1px 1px 1px rgba(255,255,255,0.3);
    -webkit-text-shadow:1px 1px 1px rgba(255,255,255,0.3);
    -ms-text-shadow:1px 1px 1px rgba(255,255,255,0.3);
    -o-text-shadow:1px 1px 1px rgba(255,255,255,0.3);

    background:linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
    background:-moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
    background:-webkit-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
    background:-o-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
    background:-ms-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);


    box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
    -moz-box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
    -webkit-box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
    -ms-box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
    -o-box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
}


#btmNavigation ul li ul{
    position:absolute;
    margin: .5px;
    display:none;
	z-index:101;
	border: 1px solid white;	
	border-radius:  0 0 6px 6px;
	background: #385c51;
}


#btmNavigation ul li ul li{
	width: 180px;
    border:1px solid white;
	
}


#btmNavigation ul li ul li a{
    padding:0px 0px;
    text-align:center;
    color:white;
    font-size:15px;
    font-weight:bold;
    text-transform:uppercase;
    letter-spacing:1px;
    cursor:pointer;
}


#btmNavigation ul li:hover ul{
    display:block;
}


#footer{
	background: #9ABD99;
	padding: 3px 0;
    width:800px;
    display:inline-block;
	border-top: 3px solid #4e8c8a;
	border-bottom: 3px solid #4e8c8a;
	border-radius: 0px;
}

.image_fade { position:relative; width:520px; height:252px; }
.image_fade img { position:absolute; left:0; top:0; }

.lowerContent{
	float: left;	
	height: auto
}




/* style cho rightMenu */

/* css cho site bai hat */
.divContent{
	margin: 0;
	width: 490px;
}
.divContent h3{
	margin: 20px;
	border-bottom: 2px solid #4e8c8a;

}
#listContent{
	padding: 0 20px 20px 20px;;
}

/*style cho sliderContainer */

.containerSlider{
	float: left;
	padding: 3px;	
}

.divContent{
	float: left;
}

.divContent li{
	width: 400px !important;	
}

/* tao effect cho div song */

.aSong{
	padding-top: 8px;
	height: 70px;
	border: 1px solid white;
	margin-bottom: 8px;
	border-radius: 6px;
}

.aSong
{
  	position:relative;       
    -webkit-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
       -moz-box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
            box-shadow:0 1px 4px rgba(0, 0, 0, 0.3), 0 0 40px rgba(0, 0, 0, 0.1) inset;
}
.aSong:before, .aSong:after
{
	content:"";
    position:absolute; 
    z-index:-1;
    -webkit-box-shadow:0 0 20px rgba(0,0,0,0.8);
    -moz-box-shadow:0 0 20px rgba(0,0,0,0.8);
    box-shadow:0 0 20px rgba(0,0,0,0.8);
    top:0;
    bottom:0;
    left:10px;
    right:10px;
    -moz-border-radius:100px / 10px;
    border-radius:100px / 10px;
} 
.aSong:after
{
	right:10px; 
    left:auto;
    -webkit-transform:skew(8deg) rotate(3deg); 
       -moz-transform:skew(8deg) rotate(3deg);     
        -ms-transform:skew(8deg) rotate(3deg);     
         -o-transform:skew(8deg) rotate(3deg); 
            transform:skew(8deg) rotate(3deg);
}

.aSong img{
	float:left;
	margin-right: 5px;
}
.songName{
	padding: 5px;
	width: 350px;
	float: left;	
	clear: both;
}


.singerName{
	float: left;
	width: 220px;
	padding: 5px;
}

.View{
	float: left;
	padding: 5px;
}



/* style cho topSong */


.tabs{
    float:left;
    width:270px;
    margin:0 auto 50px;
    position:relative;
}


.tabs input{
    position:absolute;
    top:0;
    left:0;
    display:none;
}

.tabs label{
    display:block;
    float:left;
    position:relative;

    padding:1px 3px;
    line-height:1.5em;
    min-width:55px;
    text-align:center;
    color: #385c51;
    font-size:10px;
    font-weight:bold;
    text-transform:uppercase;
    letter-spacing:1px;
    cursor:pointer;

    text-shadow:1px 1px 1px rgba(255,255,255,0.3);
    -moz-text-shadow:1px 1px 1px rgba(255,255,255,0.3);
    -webkit-text-shadow:1px 1px 1px rgba(255,255,255,0.3);
    -ms-text-shadow:1px 1px 1px rgba(255,255,255,0.3);
    -o-text-shadow:1px 1px 1px rgba(255,255,255,0.3);

    background:linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
    background:-moz-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
    background:-webkit-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
    background:-o-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);
    background:-ms-linear-gradient(top, #5ba4a4 0%, #4e8c8a 100%);

    border-radius:5px 5px 0 0;
    -moz-border-radius:5px 5px 0 0;
    -webkit-border-radius:5px 5px 0 0;
    -o-border-radius:5px 5px 0 0;
    -ms-border-radius:5px 5px 0 0;

    box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
    -moz-box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
    -webkit-box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
    -ms-box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
    -o-box-shadow:2px 0px 2px rgba(0,0,0,0.1),-2px 0 2px rgba(0,0,0,0.1);
}

.tabs label:hover{
    background:#5ba4a4;
}

.tabs label:after{
    content:"";
    display:block;
    position:absolute;
    width:100%;
    height:5px;
    background:#fff;
    left:0;
    bottom:-5px;
}
.tabs label:first-of-type{
    box-shadow: 2px 0 2px rgba(0,0,0,0.1);
    -moz-box-shadow: 2px 0 2px rgba(0,0,0,0.1);
    -webkit-box-shadow: 2px 0 2px rgba(0,0,0,0.1);
    -o-box-shadow: 2px 0 2px rgba(0,0,0,0.1);
    -ms-box-shadow: 2px 0 2px rgba(0,0,0,0.1);
}
.clear-shadow{
    clear:both;
}

.content{
    position:relative;
    width:100%;
}

.content div{
    position:absolute;
    overflow:hidden;
    top:0;
    left:0px;
    opacity:0;
    background:#fff;
   
    transition:opacity .4s;
    -moz-transition:opacity .4s;
    -webkit-transition:opacity .4s;
    -ms-transition:opacity .4s;
    -o-transition:opacity .4s;
}

.content{
	float: left;	
}


.rsTopListContent{
	padding: 10px;
}

#container .content div{
	width: 250px;
}

#container{
	float: left;
	margin: 20px 20px; 
}

.rsASong ul{
	padding: 0px;
}

.content-2 #rsTopListContent{
	padding: 10px;
}

.rsTopListContent{
	margin: 6px;
	border-top: 2px solid;	
	border-bottom: 2px solid;	
}
.rsTopListContent .rsASong{
	margin: 10px;
	border-bottom: 1px solid;
}

.rsTopListContent .rsASong ul li{
	margin: 3px;
}

.rsTopListContent .rsASong ul li a{
	margin-left: 10px;
	margin-bottom: 20px;
}
/***** Xu Ly An Hien*****/
.tabs input:checked + label{
    background:#fff;
    z-index:6;
}

.tabs input.tab-selector-1:checked ~ .content .content-1,
.tabs input.tab-selector-2:checked ~ .content .content-2
{
    opacity:1;
}


/* style cho main content */

#mainContent{
	display: block;
}
#songContent{
	padding: 10px;
	margin: 10px;
	float: left;	
	border: 1px solid #4e8c8a;
}


#relativeSong{	
	margin-top: 10px;
	padding: 0;
	width: 250px ;
	float: left;		
	border: 1px solid #4e8c8a;
}

#relativeSong h3{
	margin: 10px;
}

#relativeSong ul{
	margin: 0;
	padding:0;
	
}

#relativeSong h3{
	float: left;
	border-bottom: 2px solid
}

.rsAsong{
	float: left;
	width: 228px !important;	
	padding: 5px;
}
.rsAsong div{
	margin: 3px;
}
.rsAsong img{
	float:left;	
}
.rsSongName{
	padding: 7px 0px;
	margin: 5px 0px;
	border-bottom: 1px solid #4e8c8a;
	border-radius: 0;	
}

#relativeSong h3{
	width: 230px;
}

.rsSingerName{
	margin-right: 60px !important;
	float:left;
}


/* style cho relative div */


/*style cho siteSingger */


#mainContent{
	font-family: Tahoma, Arial, Verdana, sans-serif !important;
	color: #0784a3;
}
#divSearchNavigation{
	float: left;
	margin: 20px; 	
}

#divSingerConent{
	float: left;
	margin: 0px 20px;
}

#divSinger{
	font-weight: normal;
	line-height: 30px;
}

.nameContent{
	font-size: 24px;
	text-decoration: underline;
}

/*style of search*/
.search{
    width: 400px;
    margin: 0 auto;
}

.search h3{
    margin: 20px;
    border-bottom: 2px solid #4e8c8a;
}